<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE HTML>

<%
        String path=request.getContextPath();
        String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>



<html>
<head>

    <base href="<%=basePath%>">

    <link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css" />


</head>
<body>
<article class="page-container">
    <form class="form form-horizontal" method="post" action="${permission!=null ? 'permission/update.do':'permission/insert.do'}" id="permissionForm">
        <input type="hidden" name="permissionId" value="${permission.permissionId}">
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>权限名称</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="${permission.name}" placeholder="请输入权限名称" id="name" name="name">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>权限表达式</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="${permission.expression}" placeholder="请输入权限表达式" id="expression" name="expression">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>权限跳转地址</label>
            <div class="formControls col-xs-8 col-sm-9">
                <input type="text" class="input-text" value="${permission.url}" placeholder="请输入权限跳转地址" id="url" name="url">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>权限类型</label>
            <div class="formControls col-xs-8 col-sm-9 skin-minimal">
                <div class="radio-box">
                    <input name="type" type="radio" ${permission.type eq 'menu' ?'checked':''} value="menu" id="menu-1" checked>
                    <label for="menu-1">菜单权限</label>
                </div>
                <div class="radio-box">
                    <input type="radio" id="menu-2" name="type" ${permission.type eq 'permission' ?'checked':''} value="permission">
                    <label for="menu-2">普通权限</label>
                </div>
            </div>
        </div>

        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-3">父权限</label>
            <div class="formControls col-xs-8 col-sm-9"> <span class="select-box" style="width:150px;">
			<select class="select" name="parentId" size="1">
				<option value="0">请选择</option>
                <c:forEach var="index" items="${permissions}">
                    <option ${permission.parentId eq index.permissionId? 'selected':''} value="${index.permissionId}">${index.name}</option>
                </c:forEach>
			</select>
			</span></div>
        </div>

        <div class="row cl">
            <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                <input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
            </div>
        </div>
    </form>
</article>

<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script>



<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="lib/jquery.validation/1.14.0/messages_zh.js"></script>

<script type="text/javascript">
    /*Form进行表单验证*/
    $(function(){
        $("#permissionForm").validate({

            rules: {
                name: {
                    required: true

                },
                expression: {

                    required: true

                },
                type: {

                    required: true
                },
                parentId:{

                    required:true
                }

            },
            messages: {
                //校验失败提示消息
                name: {
                    required: "权限名不能为空!",
                },
                expression: {
                    required: "权限表达式不能为空!",
                },
                type: {
                    required:"权限类型不能为空"
                },
                parentId: {
                    required: "请选择父权限!"
                }
            },
            submitHandler: function (form) {
                /*
                *  校验成功
                * 回调函数
                  form:表单dom对象
                  使用ajax异步提交即可
                  Dom对象转换成Jquery对象：$(dom对象)
                  需要指定action,method，提交的是整个表单
                * */

                $(form).ajaxSubmit(function (data) {

                    layer.msg(data.msg, {icon: data.code, time: 1500}, function () {
                        if (data.code == 1) {

                            //刷新父页面的boostrap-Table表格
                            parent.refreshTable();

                            //让父页面关闭弹框
                            parent.layer.closeAll();
                        }
                    })

                });

            }

        });
    });
</script>
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>